<!DOCTYPE HTML>
<html lang="ru">
<head>
  <title>Charoite</title>
  <%= csrf_meta_tags %>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta charset="utf-8">
  <%= stylesheet_link_tag 'editor/pages' %>
  <link rel="stylesheet" href="/dijit/themes/claro/claro.css" media="screen">
  <script src="/dojo/dojo.js" data-dojo-config="async: true"></script>
  <script>

      var itemsStore;
      require(["charoite/store"], function(JsonRestStore)
      {
          itemsStore = new JsonRestStore({target : "/editor/api"});
      });

      var appLayout = {};
 
      function addNavigator()
      {
          require(['charoite/navigator'],
               function(Navigator)
               {
                 var navigator = new Navigator({
                   region: "left",
                   id: "leftCol",
                   design : "headline",
                   splitter: true,
                   store: itemsStore
                 });
                 appLayout.addChild(navigator);
               });
      }

      require(["dijit/layout/BorderContainer", 
               "dijit/layout/TabContainer", 
               "dijit/layout/ContentPane", 
               "dijit/Toolbar",
               "dijit/form/Button",
               "dojo/domReady!",
               "dojo/store/JsonRest"],
             
        function(BorderContainer, TabContainer, ContentPane, Toolbar, Button, JsonRestStore){
            
            // create the BorderContainer and attach it to our appLayout div
            appLayout = new BorderContainer({
                design: "headline"
            }, "appLayout");

            // create the TabContainer
            var contentTabs = new TabContainer({
                region: "center",
                id: "contentTabs",
                tabPosition: "top",
                "class": "centerPanel",
                href: "contentCenter.html"
            })

            // add the TabContainer as a child of the BorderContainer
            appLayout.addChild(contentTabs);

            // create and add the BorderContainer edge regions
            appLayout.addChild(
                new ContentPane({
                    region: "top",
                    "class": "edgePanel",
                    content: "Header content (top)"
                })
            );
                        
            addNavigator();
                            
            // Add initial content to the TabContainer
            //contentTabs.addChild(
            //    new ContentPane({
            //        href: "contentGroup1.html",
            //        title: "Group 1"
            //    })
            //);

            // start up and do layout
            appLayout.startup();
        }
        
      );
  </script>
</head>
<body class="claro">
  <div id="appLayout" class="appLayout"></div>
</body>
</html>